<!DOCTYPE html>
<html style="height:100%;">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>youtube</title>
	<script src="https://www.youtube.com/iframe_api"></script>
	
	<script type="text/javascript" src="https://onlyoffice.github.io/sdkjs-plugins/v1/plugins.js"></script>
	<script type="text/javascript" src="https://onlyoffice.github.io/sdkjs-plugins/v1/plugins-ui.js"></script>
	<link rel="stylesheet" href="https://onlyoffice.github.io/sdkjs-plugins/v1/plugins.css">
	
	<script type="text/javascript" src="scripts/youtube.js"></script>	
	<style>
		.input_error {
			display: none;
			float: left;
			position: relative;
		}

		.input_error:before {
			content: '';
			position: absolute;
			right: 3px;
			top: 3px;
			width: 16px;
			height: 16px;
			background: url();
		}
	</style>
</head>
<body style="-ms-touch-action: none;-moz-user-select:none;-khtml-user-select:none;user-select:none;width:100%;height:100%;margin:0;padding:0;overflow:hidden;box-sizing:border-box;">

<div id="td_labelUrl" style="position:absolute;left:15px;top:15px;right:15px;height:20px;margin:0;padding:0;" class="defaultlable">Paste youtube video URL</div>

<div style="position:absolute;left:15px;top:35px;right:15px;height:40px;margin:0;padding:0;">
	<div style="position:absolute;left:0px;top:0px;right:40px;height:100%;margin:0;padding:0;">  
		<input type="text" class="form-control" style="left:0px;top:0px;width:100%;" id="textbox_url" autofocus="autofocus" autocomplete="off">
		<div id="input_error_id" class="input_error" style="position:absolute; top:0px; right:0px; width: 0px; height: 16px; display: none;"></div>
	</div>
	<button class="btn-text-default" style="position:absolute;top:0px;right:0px;width:30px;" id="textbox_button">OK</button>
</div>

<div id="id_player" style="position:absolute;left:15px;top:75px;right:15px;bottom:15px;margin:0;padding:0;"></div>

</body>
</html>
</html>